import Taro, { Component } from '@tarojs/taro'
import { View, Button } from '@tarojs/components'
import { findRssDetail } from '../../api';
import { pushHistory, dateFormat, pushFavorite, removeFavorite, findFavoriteIndex } from '../../utils'
import './index.less'

const desc = (body) => {
  if (body.length > 300) {
    return body.substr(0, 300) + '...'
  }
  return body
}

export default class Index extends Component {

  state = {
    isFav: false,
    isShare: false,
    detail: {},
  }
  setShare(isShare) {
    this.setState({
      isShare
    })
  }
  componentWillMount() {

    let { id, source, shareLink } = this.$router.params
    const rss_detail = Taro.getStorageSync('rss_detail')
    //分享过来
    if (shareLink) {

      if (rss_detail && rss_detail.link == decodeURIComponent(shareLink)) {
        this.setShare(false)
        this.setState({
          detail: rss_detail,
          isFav: findFavoriteIndex(rss_detail) > -1
        })
        pushHistory(rss_detail)
      } else {
        this.setShare(true)
      }

    } else if (['history', 'favorite'].includes(source) && !id) {
      this.setState({
        detail: rss_detail,
        isFav: findFavoriteIndex(rss_detail) > -1
      })   
      pushHistory(rss_detail)
    } else {
      findRssDetail({ id }).then(res => {
        if(res.data[0]){
          this.setState({
            detail: res.data[0],
            isFav: findFavoriteIndex(res.data[0]) > -1
          })
          pushHistory(rss_detail)
          this.setShare(false)
        }else{
          this.setShare(true)
        }
       
       
      })
    }

    // if (shareLink) {

    //   if (rss_detail && rss_detail.link == decodeURIComponent(shareLink)) {
    //     this.setState({
    //       isShare: false
    //     })


    //     pushHistory(rss_detail)
    //   } else {
    //     this.setState({
    //       isShare: true
    //     })
    //   }

    // } else {
    //   this.setState({
    //     isShare: false
    //   })



    //   this.setState({
    //     detail: rss_detail,
    //     isFav: findFavoriteIndex(rss_detail) > -1
    //   })

    //   pushHistory(rss_detail)
    // }
  }

  componentDidMount() { }

  componentWillUnmount() { }
  config = {
    usingComponents: {
      parser: '../../components/parser.min/parser'
    },
    navigationBarTitleText: '详情'
    // navigationStyle: 'custom',
  }

  componentDidShow() { }

  componentDidHide() { }
  onShareAppMessage() {
    let p = []
    p.push('shareLink=' + encodeURIComponent(this.state.detail.link))
    p.push('title=' + this.state.detail.title)
    p.push('id=' + (this.state.detail._id || ''))
    return {
      title: 'RSS阅读器',
      desc: '提升阅读效率',
      imageUrl: require('../../assets/img/title.jpg'),
      path: '/pages/detail/index? ' + p.join('&')
    }
  }
  toHome() {
    Taro.switchTab({
      url: '/pages/index/index'
    })
  }
  copyLink() {
    Taro.setClipboardData({
      data: this.state.detail.link || decodeURIComponent(this.$router.params.shareLink),
      success: function () {

      }
    })
  }
  onFav(isFav) {
    this.setState({
      isFav
    })
    if (isFav) {

      pushFavorite(this.state.detail)
    } else {
      removeFavorite(this.state.detail)
    }
  }
  render() {
    return (
      <View className='padding bg-white radius shadow-lg'>
        {this.state.isShare ?
          <View>
            <View class='margin-bottom text-lg'>{this.$router.params.title}</View>
            <View class='text-content'>
              <View>当前版本分享的内容暂不支持查看</View>
              <View>请复制下面网址，到浏览器打开查看内容。</View>
            </View>
            <View class='margin-bottom text-lg'>{decodeURIComponent(this.$router.params.shareLink)}</View>
            <View class hover-class='none' hover-stop-propagation='false'>
              <Button onClick={() => this.copyLink()} class='default' size='default' type='default'>复制网址</Button>
            </View>
          </View>
          :
          <View>


            <View className='margin-bottom text-lg'>{this.state.detail.title}</View>
            <View className='margin-bottom text-lg'>{dateFormat(this.state.detail.pubDate)}</View>


            <View className='text-content'>
              <parser html={this.state.detail.content} >
              </parser>
            </View>
            <View className='cu-bar tabbar bg-white'>
              <View onClick={() => this.toHome()} className='action text-gray'>
                <View className='cuIcon-home'></View>首页
           </View>
              <Button
                open-type='share'
                className='action text-gray  bg-white'
              >
                <View className=' cuIcon-share lg text-gray'></View>
      分享
            </Button>
              <View onClick={() => this.copyLink()} className='action text-gray'>
                <View className='cuIcon-copy lg text-gray'></View>
复制链接
      </View>

              {
                this.state.isFav ?
                  <View onClick={() => this.onFav(false)} className='action  text-green'>
                    <View className='cuIcon-favorfill lg text-green'></View>
取消收藏
  </View> : <View onClick={() => this.onFav(true)} className='action  text-gray'>
                    <View className='cuIcon-favor lg text-gray'></View>
                收藏
      </View>
              }

            </View>
          </View>
        }
        <View className='ad'>
          <Ad unit-id="adunit-275d29f4b149d02f"></Ad>
        </View>

      </View>
    )
  }
}
